<template>
  <div class="model-container">
    <div class="listName">采购入库</div>
    <!--搜索-->
    <el-card shadow="never">
      <div slot="header" class="clearfix">
        <el-button type="primary" style="margin-left: 50px;float: right" size="mini" plain @click="newCreateOrder">开新订单</el-button>
        <span>快捷搜索</span>
        <div class="btns-wrapper-right">
          <el-button v-if="!searchShow" icon="el-icon-arrow-down" @click="searchShow = true"/>
          <el-button v-else icon="el-icon-arrow-up" @click="searchShow = false"/>
        </div>
      </div>
      <el-collapse-transition>
        <div v-show="searchShow" class="cardbody">
          <el-form ref="seacherParam" :model="seacherParam">
            <el-row :gutter="10">
              <el-col :xl="5" :lg="6" :md="6" :sm="8" >
                <el-col :xl="17" :lg="17" :md="16" :sm="16">
                  <el-form-item prop="nickName">
                    <el-input v-model="seacherParam.searchMessage" size="small" placeholder="订单编号/收货人" maxlength="15"/>
                  </el-form-item>
                </el-col>
              </el-col>
            </el-row>
            <div class="cardfooter">
              <el-button type="primary" size="mini" plain @click="seachFun">查询</el-button>
              <el-button type="warning" size="mini" plain @click="resetFun">重置</el-button>
            </div>
          </el-form>
        </div>
      </el-collapse-transition>
    </el-card>
    <!--表格-->
    <el-card style="margin-top: 10px">
      <div class="table-wrapper">
        <el-table v-loading="!dataOption" :stripe="true" :data="dataOption" border empty-text="暂无数据" @selection-change="changeFun">

          <el-table-column align="center" prop="odd" label="采购单号"/>

          <el-table-column align="center" prop="createdTime" label="下单时间"/>

          <el-table-column align="center" prop="realName" label="收货人"/>

          <el-table-column align="center" prop="taxRate" label="税率" />

          <el-table-column align="center" prop="total" label="采购金额" />

          <el-table-column align="center" label="订单状态">
            <template slot-scope="scope">{{ deliveryStatusVal(scope.row.documentsState) }}</template>
          </el-table-column>

          <el-table-column v-if="this.label1" align="center" prop="name" label="所属门店"/>

          <el-table-column v-if="this.label2" align="center" prop="qname" label="所属企业"/>

          <el-table-column align="center" label="操作" width="200px">
            <template slot-scope="scope">
              <el-button title="查看" type="primary" circle class="table-icon" @click="check(scope.row)"><i class="iconfont icon-chakan2"/></el-button>

              <el-button title="编辑" :disabled="scope.row.documentsState>3" type="primary" circle icon="el-icon-edit" class="table-icon" @click="editshoporder(scope.row)"/>

<!--              <el-button :disabled=pt v-if="scope.row.documentsState === 1" type="success" size="mini" plain @click="SH(scope.row)">审核通过</el-button>-->

<!--              <el-button :disabled=md v-if="scope.row.documentsState === 2" type="success" size="mini" plain @click="FK(scope.row)">立即付款</el-button>-->

              <el-button :disabled=pt v-if="scope.row.documentsState === 3" type="success" size="mini" plain @click="FH(scope.row)">确认发货</el-button>

              <el-button v-if="scope.row.documentsState === 5" type="success" size="mini" plain @click="Delete(scope.row)">删除</el-button>

<!--              <el-button :disabled=md v-if="scope.row.documentsState === 4" type="success" size="mini" plain @click="JS(scope.row)">确认接收</el-button>-->
            </template>
          </el-table-column>
        </el-table>

        <!--分页-->
        <el-pagination
          :current-page="pageNo"
          :page-sizes="[10, 20, 30]"
          :page-size="pageSize"
          :total="rowCount"
          background
          layout="total, sizes, prev, pager, next, jumper"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"/>

        <el-dialog
          :title="dialogTitle"
          :visible.sync="dialogState"
          :close-on-click-modal="false"
          :before-close="handleClose"
          top="5vh"
          width="40%">
          <el-form ref="dialogBindData" :model="dialogBindData" :rules="rules" label-width="30%" status-icon class="demo-ruleForm">
            <div class="formBody">
              <el-form-item label="物流公司" prop="logistic">
                <el-input v-model="dialogBindData.logistic" size="small" type="text" placeholder="物流公司" maxlength="15"/>
              </el-form-item>
              <el-form-item label="物流单号" prop="oddNumber">
                <el-input v-model="dialogBindData.oddNumber" size="small" type="text" placeholder="物流单号" maxlength="15"/>
              </el-form-item>
            </div>
            <div class="btns-wrapper">
              <el-button size="small" @click="handleClose">取 消</el-button>
              <el-button :loading="buttonState" type="primary" size="small">保 存</el-button>
            </div>
          </el-form>
        </el-dialog>
      </div>
    </el-card>
  </div>
</template>

<script>
  import * as order from '../../api/order'
  import * as userMessage from '../../utils/auth'
  import ImageCropper from '@/components/ImageCropper'
  import {isvalidNull, validatePhone} from "../../utils/validate";
  import * as member from "../../api/member";

  export default {
    components: {
      ImageCropper
    },
    data() {
      return {
        label1:true,
        label2:true,
        pt:true,
        md:true,
        button:true,
        dialogTitle:'确认发货',
        sid:'',
        neid:'',
        number:0,
        // 页面搜索
        seacherParam: {
          searchMessage: ''
        },
        searchShow: false,
        pageNo: 1,
        pageSize: 10,
        rowCount: null, // 总条数
        // 弹框
        dialogType: 1, // 1--增加  2--编辑  3--查看
        dialogState: false,
        // 按钮状态
        buttonState: false,
        // 列表数据
        dataOption: null,
        datavalID: [],
        // 提交内容
        type: '',

        dialogBindData: {
          logistic:'',
          oddNumber:'',
        },
        rules: {

        },
        sc:'',
        // 上传头像
      }
    },
    computed: {

    },

    beforeMount() {
      //console.log(JSON.parse(userMessage.getUserInformation()))
      this.getOrderList()
    },

    created() {
      this.initUploadFileurl()
    },
    methods: {
      initUploadFileurl() {
        this.actionUrl = process.env.BASE_API + 'file/uploadImageAndCrtThumbImagesRichEdit'
      },
      seachFun() {
        this.pageNo = 1
        this.pageSize = 10
        const url = this.searchData()
        this.getOrderList(url)
      },
      getOrderList(data) {
        let url = ''
        if (data !== '' && data !== undefined) {
          url = data
        }
        var sys_user=JSON.parse(userMessage.getUserInformation());
        //console.log(sys_user)
        if(!sys_user.neid||sys_user.neid==='1'){
          if(!sys_user.shopId){
            if(sys_user.neid!=='1'){
              this.pt=false
            }
            //alert("你是平台")
            this.pt=false
            this.sid=sys_user.shopId
            const param = {
              current: this.pageNo,
              size: this.pageSize,
              url: url,
            }
            order.getShopOrderList(param).then(res => {
              console.log(res)
              if (res.data.code !== 1) {
                this.$message.error(res.data.msg)
                return false
              }
              if (res.data.data === 'null' || res.data.data === null) {
                return false
              }
              // 初始话表格数据
              this.dataOption = res.data.data
              // 初始化分页数据
              order.getShopOrderListSize(param).then(res => {
                this.rowCount = res.data.count
                this.pageSize = res.data.size
              })
            })
          }else{
            this.label1=false
            this.label2=false
            //alert("你是门店")
            this.md=false
            this.sid=sys_user.shopId
            const param = {
              current: this.pageNo,
              size: this.pageSize,
              url: url,
              sid: this.sid,
            }
            order.getShopOrderListMen(param).then(res => {
              //console.log(res)
              if (res.data.code !== 1) {
                this.$message.error(res.data.msg)
                return false
              }
              if (res.data.data === 'null' || res.data.data === null) {
                return false
              }
              // 初始话表格数据
              this.dataOption = res.data.data
              // 初始化分页数据
              order.getShopOrderListSizeMen(param).then(res => {
                this.rowCount = res.data.count
                this.pageSize = res.data.size
              })
            })

          }
        }else{
          this.label2=false
          this.md=false
          //alert("你是企业")
          this.neid=sys_user.neid
          const param = {
            current: this.pageNo,
            size: this.pageSize,
            url: url,
            neid: this.neid,
          }
          order.getShopOrderListQi(param).then(res => {
            console.log(res)
            if (res.data.code !== 1) {
              this.$message.error(res.data.msg)
              return false
            }
            if (res.data.data === 'null' || res.data.data === null) {
              return false
            }
            // 初始话表格数据
            this.dataOption = res.data.data
            // 初始化分页数据
            order.getShopOrderListSizeQi(param).then(res => {
              this.rowCount = res.data.count
              this.pageSize = res.data.size
            })
          })
        }
      },
      newCreateOrder(){
        this.$router.push({
          name: '/v1/commoditylist',
        })
      },
      exechan(){
        this.dialogBindData.total=this.dialogBindData.price*this.dialogBindData.count
        this.dialogBindData.total1=parseInt(this.dialogBindData.total)
      },
      Delete(data){
        console.log(data)
        this.$confirm('此操作将删除该订单, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          order.deleteById(data.id).then(res=>{
            if (res.data.code === 1) {
              this.$message({
                message: '删除成功',
                type: 'success'
              })
              this.getOrderList();
            }
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          })
        })

      },
      // 编辑
      edit() {
        this.vipValue='0';
        this.dialogState = true
        this.reBindData(data)
      },
      SH(data){
        console.log(data)
        const param = {
          id:data.id
        }
        order.updataByIdExamine(param).then(res=>{
          if (res.data.code !== 1) {
            this.$message({
              message: res.data.msg,
              type: 'warning'
            })
            return false
          }
          this.$message({
            message: '审核成功',
            type: 'success'
          })
          this.getOrderList()
        })
      },

      FH(data){
        console.log(data)
        const param = {
          id:data.id
        }
        order.updataByIdDeliver(param).then(res=>{
          if (res.data.code !== 1) {
            this.$message({
              message: res.data.msg,
              type: 'warning'
            })
            return false
          }
          this.$message({
            message: '发货成功',
            type: 'success'
          })
          this.getOrderList()
        })
      },

      changeFun(data) {
        this.datavalID = data
      },
      // 反显
      reBindData(data) {
        for (const key in this.dialogBindData) {
          this.dialogBindData[key] = data[key]
        }
      },
      // 搜索过滤
      searchData() {
        const arr = []
        for (const key in this.seacherParam) {
          if (this.seacherParam[key] !== '') {
            arr.push('&' + key + '=' + this.seacherParam[key])
          }
        }
        const url = arr.join('')
        return url
      },
      // 重置
      resetFun() {
        this.$refs.seacherParam.resetFields()
        this.pageNo = 1
        this.pageSize = 10
        this.getOrderList()
      },
      //(1已登记,2已审核,3已付款,4已发货,5已完成,6已放弃)
      deliveryStatusVal(type){
        if (type === 1) {
          return '已登记待审核'
        } else if (type === 2) {
          return '待付款'
        } else if (type === 3) {
          return '已付款待发货'
        } else if (type === 4) {
          return '已发货待接收'
        } else if (type === 5) {
          return '已完成'
        } else if (type === 6) {
          return '已放弃'
        }
      },
      getTitle(type){
        if (type === 1) {
          return '审核'
        } else if (type === 2) {
          return '付款'
        } else if (type === 3) {
          return '发货'
        } else if (type === 4) {
          return '已接收'
        } else if (type === 5) {
          return '无'
        } else if (type === 6) {
          return '无'
        }
      },
      handleSizeChange(val) {
        console.log(`每页 ${val} 条`)
        this.pageSize = val
        this.getOrderList()
      },
      handleCurrentChange(val) {
        console.log(`当前页: ${val}`)
        this.pageNo = val
        this.getOrderList()
      },
      handleClose() {
        for (const key in this.dialogBindData) {
          this.dialogBindData[key] = ''
        }
        this.type = ''
        this.dialogState = false
        this.$refs.dialogBindData.clearValidate()
      },
      // 上传头像
      cropSuccess(resData) {
        this.imagecropperShow = false
        this.imagecropperKey = this.imagecropperKey + 1
        this.picUrl = resData.data[0].maxImageUrl
      },
      close() {
        this.imagecropperShow = false
      },
      memberCat(data) {
        this.$router.push({
          name: '/v1/membercar',
          params: {
            data: data
          }
        })
      },
      check(data) {
        this.$router.push({
          name: '/v1/shoporderdetails',
          params: {
            order: data
          }
        })
        //sessionStorage.setItem('orderList_searchData', JSON.stringify(this.seacherParam))
      },
      editshoporder(data) {
        this.$router.push({
          name: '/v1/editororder',
          params: {
            order: data
          }
        })
        //sessionStorage.setItem('orderList_searchData', JSON.stringify(this.seacherParam))
      },
    }
  }
</script>
<style type="text/scss" lang="scss" scoped>
  .uploadImg{
    width: 100px;
    height: 100px;
    border-radius: 50%;
    cursor: pointer;
    position: relative;
    /*border: 1px dashed #dcdfe6;*/
    img{
      display: block;
      border-radius: 50%;
      width: 100%;
      height: 100%;
    }
    .uploadImg_mock{
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      border-radius: 50%;
      background-color: rgba(0,0,0,0);
      transition:background-color 0.35s;
      -webkit-transition: background-color 0.35s;
      i{
        position: absolute;
        top: 50%;
        left: 50%;
        color: #fff;
        font-size: 26px;
        margin-left: -12px;
        margin-top: -16px;
        opacity: 0;
        transition:opacity 0.35s;
        -webkit-transition: opacity 0.35s;
      }
    }
    &:hover .uploadImg_mock{
      background-color: rgba(0,0,0,0.5);
      i{
        opacity: 1;
      }
    }
  }

</style>
